<template>
    <view class="fixed-btn">
        <u-image :src="proxy.$icon.write" width="96rpx" height="96rpx" @click="showMenu"></u-image>
        <u-popup v-model="isShow" mode="bottom" :safe-area-inset-bottom="true" :z-index="100000001">
			<u-grid :col="4" :border="false">
                <u-grid-item v-for="(item,index) in menu" :key="index" @click="gotoPage(item)">
                    <u-image :src="item.icon" width="96rpx" height="96rpx"></u-image>
                    <view class="grid-text mt-2">{{ item.name }}</view>
                </u-grid-item>
            </u-grid>
            <u-gap height="120" bg-color="#ffffff"></u-gap>
		</u-popup>
    </view>
</template>
<script setup lang="ts">
import { useAppStore } from '@/stores/app';
const appStore = useAppStore();
const {proxy} = getCurrentInstance() as ComponentInternalInstance;
let isShow = ref(false);
let menu = reactive([
    {name: '笔记', icon: proxy.$icon.note, url: '/packageB/creation/selectActivity'},
    {name: '推书', icon: proxy.$icon.book, url: '/packageB/creation/book'},
    {name: '文章', icon: proxy.$icon.article, url: '/packageB/creation/article'},
    {name: '草稿箱', icon: proxy.$icon.draft2, url: '/packageB/creation/draft'}
]);
const gotoPage = (item) => {
    appStore.checkExpire().then(res => {
        if(!res){
            proxy.$util.gotoPage(item.url);
            isShow.value = false;
        }
    });

    
};
const showMenu = () => {
    appStore.getUserInfo().then(res => {
        isShow.value = true;
    })
}
</script>
<style lange="scss" scoped>
.fixed-btn{
    position: fixed;right:30rpx;bottom:calc(180rpx + var(--safe-area-inset-bottom));
}
</style>